<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>我的订单</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/renting/css/public.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/renting/css/layui.css">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/renting/css/header.css" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/renting/css/bottom.css"/>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/renting/css/tenant_public.css"/>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/renting/css/tenant_order.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layuimini.css?v=2.0.4.2" media="all">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/themes/default.css" media="all">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/lib/font-awesome-4.7.0/css/font-awesome.min.css" media="all">
    <style type="text/css">
        .link a{
            display: block;
            position: relative;
            top: -25px;
        }
    </style>
</head>
<body>
<div class="header">
    <div class="nav">
        <a href="${pageContext.request.contextPath}/renting/index.jsp" class="nav_title">好客租房</a>
        <select class="select">
            <option value="重庆">重庆</option>
            <option value="贵阳">贵阳</option>
            <option value="重庆">重庆</option>
            <option value="贵阳">贵阳</option>
        </select>
        <ul class="nav_ul">
            <li><a href="${pageContext.request.contextPath}/renting/index.jsp">首页</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/onther/Findroom.jsp">轻松找房</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/onther/entry.jsp">房东入驻</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/onther/chat_news.jsp">消息</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/onther/login.jsp" style="color: #2981c8;">登录</a></li>
        </ul>
        <img src="${pageContext.request.contextPath}/renting/img/icon/lianxi-1.png" class="nav_img" style="margin-top: -20px;">
        <p class="nav_phone">
            <span>13301131116</span>
            <span>13301131116</span>
        </p>
    </div>
</div>
<div class="body">
    <div class="portrait_bg">
        <div class="portrait">
            <a href="${pageContext.request.contextPath}/renting/pages/onther/personal.jsp" class="headImg">
                <img style="width: 100px;height: 100px;border-radius: 50%" src="../../img/${drom.avater}">
            </a>
        </div>
        <p class="nickname">点击头像编辑个人资料</p>
    </div>
    <div class="content">
        <ul class="left_ul">
            <li><a href="${pageContext.request.contextPath}/renting/pages/tenant/inspection.jsp"><img src="${pageContext.request.contextPath}/renting/img/xuanzhongtiao.png" >看房记录</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/tenant/appointment.jsp"><img src="${pageContext.request.contextPath}/renting/img/xuanzhongtiao.png" >我的预约</a></li>
            <li class="li_active"><a href="${pageContext.request.contextPath}/renting/pages/tenant/order.jsp"><img src="${pageContext.request.contextPath}/renting/img/xuanzhongtiao.png" >我的订单</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/tenant/collection.jsp"><img src="${pageContext.request.contextPath}/renting/img/xuanzhongtiao.png" >我的收藏</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/tenant/wallet.jsp"><img src="${pageContext.request.contextPath}/renting/img/xuanzhongtiao.png" >我的钱包</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/tenant/ID_verification.jsp"><img src="${pageContext.request.contextPath}/renting/img/xuanzhongtiao.png" >身份验证</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/tenant/contract.jsp"><img src="${pageContext.request.contextPath}/renting/img/xuanzhongtiao.png" >电子合同</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/tenant/about.jsp"><img src="${pageContext.request.contextPath}/renting/img/xuanzhongtiao.png" >联系我们</a></li>
        </ul>
        <div class="right_body">
            <div class="right_content">
                <div class="right_title">
                    <p>我的订单</p>
                </div>
                <div class="stripe">
                    <span>订单详情</span>
                    <span>租金</span>
                    <span>状态</span>
                    <span>操作</span>
                </div>
                <div class="right_main">

                </div>
            </div>
        </div>
        <div style="clear: both;"></div>
    </div>
</div>
<div class="bottom">
    <p>沪公网安备 31011402005354号</p>
</div>
</body>
</html>
<script src="${pageContext.request.contextPath}/renting/js/jQuery-3.4.1.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/layui/lib/layui-v2.6.3/layui.js"></script>
<script src="${pageContext.request.contextPath}/renting/js/header.js"></script>
<script type="text/javascript">
    judge_login("${pageContext.request.contextPath}/renting/pages/tenant/inspection.jsp","${pageContext.request.contextPath}/renting/pages/onther/login.jsp");
</script>
<script src="${pageContext.request.contextPath}/renting/js/ScrollHolder.js"></script>
<script>
    //layui全局
    layui.use(["layer"],function (){
        $.ajax({
            url:"${pageContext.request.contextPath}/order/queryList",
            type:"post",
            async:false,
            dataType:"JSON",
            success:function (redata){
                var data = redata.data;
                for(var ia=0;ia<data.length;ia++){
                    console.log(data)
                    var tempdate = getMonthNumber(formatDate(data[ia].older.leaseEffectiveTime).replaceAll("-",""),formatDate(data[ia].older.leaseExpirationTime).replaceAll("-",""));
                    $(".right_main").append("<div class='item'>"
                        +"<div class='item_img'>"
                        +"<img src='${pageContext.request.contextPath}/renting/img/"+data[ia].img+"' >"
                        +"<div class='item_info'>"
                        +"<p>"+data[ia].address.communityName+"</p>"
                        +"p>"+data[ia].address.communityAddress+"</p>"
                        +"<p>"+data[ia].house.buildingType+"<span>"+data[ia].house.houseType+"</span>"+data[ia].house.floorSituation+"</p>"
                        +"</div>"
                        +"</div>"
                        +"<div class='data'>"
                        +"<p>"+tempdate+"*"+data[ia].house.price+"="+(Number(tempdate)*Number(data[ia].house.price))+"元</p>"
                        +"<p>押金:"+(data[ia].house.paymentMethod==0?'0':data[ia].house.price)+"元</p>"
                        +"<p>总计:"+(data[ia].house.paymentMethod==0?(Number(tempdate)*Number(data[ia].house.price)):(Number(tempdate)*Number(data[ia].house.price))+Number(data[ia].house.price))+"元</p>"
                        +"</div>"
                        +"<span>"+(data[ia].older.status==1?'未生效':'已生效')+"</span>"
                        +"<span class='link'>"
                        +"<a href='${pageContext.request.contextPath}/order/updateOrderStatus?rid="+data[ia].older.rid+"'>确认</a>"
                        +"<a rid='"+data[ia].older.rid+"' class='cancelbtn' href='#'>取消</a>"
                        +"</span>"
                        +"</div>");
                }
            },
            erro:function (e){
                console.log(e);
            }
        });


        $(".cancelbtn").click(function (){
            $.ajax({
                url:'${pageContext.request.contextPath}/order/delOrder?oid='+$(this).attr("rid"),
                type:'post',
                async:false,
                success:function (redata){
                    // $(this).parent().parent().remove();
                    location.reload();
                },
                erro:function (e){
                    console.log(e)
                }
            })
            return false;

        })



//计算时间差
        function getMonthNumber(date1,date2){
            //默认格式为"20030303",根据自己需要改格式和方法
            var year1 =  date1.substr(0,4);//老
            var year2 =  date2.substr(0,4);//新
            var month1 = date1.substr(4,2);
            var month2 = date2.substr(4,2);
            var len=(year2-year1)*12+(month2-month1);
            return len;
        }

        //获取当前时间
        function getNowTime(){
            var date="";
            var dates = new Date();
            date+=dates.getFullYear();
            date+=dates.getMonth()+1;
            date+=dates.getDate();
            return date;
        }


        function formatDate(date) {
            var date = new Date(date);
            var YY = date.getFullYear() + '-';
            var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
            var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
            return YY + MM + DD
        }


    })






</script>